<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src=""></script>
	</head>
	<style>
		ul{
			display: flex;
		}
		li{
			list-style: none;
			width: 50px;
			height: 50px;
			border-radius: 50%;
			color: #fff;
			text-align: center;
			line-height: 50px;
			margin: 10px;
		}
		/* 进入enter 退出 移动move */
		.list-move{
			transition: all .5s;
		}
	</style>
	<body>
		<div id="app">
			<button @click="order(1)">升序</button>
			<button @click="order(2)">降序</button>
			<button @click="order(3)">乱序</button>
			<ul>
				<li v-for="i in list">{{i}}</li>
			</ul>
		</div>
		<script>
			Vue.createApp({
				data(){
					return{
						list:[1,2,3,4,5,6,7,8]
					}
				},
				methods:{
					order(type){
						if(type == 1){
							//升序
							this.list.sort((a,b)=>)
						}
					}
				}
			})
		</script>
	</body>
</html>